<!DOCTYPE html>
<html>
<head>
  <meta content="text/html;charset=UTF-8"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  <title>首页</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"/>
  <!-- Bootstrap 3.3.6 -->
  <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}"/>
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css"></link>  
  <!-- Ionicons -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css"></link> 
  <!-- Theme style -->
  <link rel="stylesheet" th:href="@{/dist/css/AdminLTE.min.css}"></link>
  <!-- AdminLTE Skins. Choose a skin from the css/skins
       folder instead of downloading all of them to reduce the load. -->
 <link rel="stylesheet" th:href="@{/dist/css/skins/_all-skins.min.css}"></link>
</head>
<body class="hold-transition skin-blue sidebar-mini">
<!-- Site wrapper -->
<div class="wrapper">
  <header class="main-header" >
     <a href="index2.html" class="logo" th:if="${user ne null}">
      <!-- mini logo for sidebar mini 50x50 pixels -->
      <span class="logo-mini"><b>中</b>公</span>
      <!-- logo for regular state and mobile devices -->
      <span class="logo-lg"><b>Road</b>maint</span>
    </a>
    <!-- Header Navbar: style can be found in header.less -->
    <nav class="navbar navbar-static-top">
     <!-- Sidebar toggle button-->
      <a href="javascript:void(0);" class="sidebar-toggle" data-toggle="offcanvas" role="button" th:if="${user ne null}">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>
      <div class="navbar-custom-menu">
        <ul class="nav navbar-nav" th:if="${user eq null}">
          <li class="dropdown user user-menu" >
            <a th:href="@{/index}"  target="_top">
              <span class="hidden-xs">登录</span>
            </a>
          </li>
        </ul>
        <ul class="nav navbar-nav" th:if="${user ne null}">
          <li th:each="mods:${user.modules}" th:if="${#lists.size(#strings.listSplit(mods.parentIds,',')) eq 2}"><a style="cursor: pointer;" th:href="${mods.moduleName eq '首页'}?@{/}:@{/index(sysId=${mods.id})}" th:text="${mods.moduleName}"></a></li>
          <li class="dropdown user user-menu" >
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
              <img th:src="@{/dist/img/user2-160x160.jpg}" class="user-image" alt="User Image"/>
              <span class="hidden-xs" th:text="${user.name}"></span>
            </a>
            <ul class="dropdown-menu">
              <li class="user-header">
                <img th:src="@{/dist/img/user2-160x160.jpg}" class="img-circle" alt="User Image"/>
                <p> 
                  <span th:text="${user.name + ' - '+user.description}"></span>
                  <small th:text="${user.regTime}?${'注册时间：' +  #dates.format(user.regTime, 'yyyy-MM-dd')}:'注册时间：-'"></small>
                  <!-- <small  th:text="${user.regTime}?'':${'注册时间：' +  #dates.format(user.regTime, 'yyyy-MM-dd')}"></small> -->
                </p>
              </li>
              <li class="user-footer">
                <div class="pull-left">
                  <a href="#" class="btn btn-default btn-flat">个人资料</a>
                </div>
                <div class="pull-right">
                  <a th:href="@{/logout}" class="btn btn-default btn-flat">登出</a>
                </div>
              </li>
            </ul>
          </li>
          <!-- Control Sidebar Toggle Button -->
          <li>
            <a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
          </li>
        </ul>
      </div>
    </nav>
  </header>
  <!-- =============================================== -->
  <!-- Left side column. contains the sidebar -->
  <aside class="main-sidebar" th:if="${user ne null}">
    <!-- sidebar: style can be found in sidebar.less -->
    <section class="sidebar">
      <!-- Sidebar user panel -->
      <div class="user-panel" th:if="${user ne null}">
        <div class="pull-left image">
            <img th:src="@{/dist/img/user2-160x160.jpg}" class="img-circle" alt="User Image"/>
        </div>
        <div class="pull-left info">
          <p th:text="${user.name}"></p>
          <a href="#"><i class="fa fa-circle text-success"></i> 在线</a>
        </div>
      </div>
      
       <ul class="sidebar-menu" th:if="${sysId ne null}">
        <li class="header">系统模块菜单</li>
        
        <li class="treeview"  th:each="pas:${user.getNextModules(sysId)}" >
          <a href="javascript:void(0);" ><!-- @{${pas.moduleLink}} -->
            <i class="fa fa-laptop"></i> <span th:text="${pas.moduleName}"></span>
            <span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          
          <ul class="treeview-menu">
             <li th:each="item:${user.getNextModules(pas.id)}" name="selectN">	
                        	
             	<a th:if="${user.isLeaf(item.id) eq '1'}"  href="javascript:void(0);" th:id="${'item_'+item.id}"   th:onclick="'javascript:loadFrame(\''+${item.id}+'\',\''+${item.serverId}+'\',\''+${user.getNavInfos(item)}+'\',\''+${item.moduleLink}+'\');'"><i class="fa fa-circle-o" th:text="${'&nbsp;&nbsp;' +item.moduleName}"></i>
             	</a>
             	<a th:if="${user.isLeaf(item.id) eq '0'}"  href="javascript:void(0);"><i class="fa fa-circle-o" th:text="${'&nbsp;&nbsp;' +item.moduleName}"></i></a>
             	
             	<ul class="treeview-menu" th:each="three:${user.getNextModules(item.id)}" th:if="${three.isMenu eq '1'}">
             		<li><a href="javascript:void(0);" th:id="${'item_'+item.id}"  th:onclick="'javascript:loadFrame(\''+${item.id}+'\',\''+${three.serverId}+'\',\''+${user.getNavInfos(three)}+'\',\''+${three.moduleLink}+'\');'"><i class="fa fa-circle-o"></i><span th:text="${three.moduleName}"></span></a></li>
             	</ul>
             </li>
          </ul>
        </li>
	    <li><a href="javascript:void(0);" onclick="locationUrl()"><i class="fa fa-book"></i> <span>系统操作文档</span></a></li>
        <li><a href="#"><i class="fa fa-circle-o text-red"></i> <span>Important</span></a></li>
        <li><a href="#"><i class="fa fa-circle-o text-yellow"></i> <span>Warning</span></a></li>
        <li><a href="#"><i class="fa fa-circle-o text-aqua"></i> <span>Information</span></a></li>
      </ul>
    </section>
    <!-- /.sidebar -->
  </aside>

  <!-- =============================================== -->

  <!-- Content Wrapper. Contains page content -->
  <div   class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1 id="titleId">
      系统管理
      </h1>
      <ol class="breadcrumb" id="navPId">
        <li id="navId"><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
        <li class="active">系统管理</li>
      </ol>
    </section>

    <!-- Main content -->
    <section id="sectCxid" class="content" >
		<div  class="box" >
			<iframe id="frameContentId"  frameborder="0" th:src="@{/appli}" width="100%;" height="100%"></iframe>
		</div>
      <!-- Default box -->
   <!--    <div class="box">
        <div class="box-header with-border">
          <h3 class="box-title">Title</h3>

          <div class="box-tools pull-right">
            <button type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
              <i class="fa fa-minus"></i></button>
            <button type="button" class="btn btn-box-tool" data-widget="remove" data-toggle="tooltip" title="Remove">
              <i class="fa fa-times"></i></button>
          </div>
        </div>
        <div class="box-body">
          Start creating your amazing application!
        </div>
        /.box-body
        <div class="box-footer">
          Footer
        </div>
        /.box-footer
      </div> -->
      <!-- /.box -->

    </section>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->

  <footer class="main-footer">
    <div class="pull-right hidden-xs">
      <b>Version</b> 0.0.1
    </div>
    <strong>Copyright &copy; 2016-2017 <a href="http://www.roadmaint.com">roadmaint</a>.</strong> All rights
    reserved.
  </footer>

   <!-- Control Sidebar -->
  <aside class="control-sidebar control-sidebar-dark">
    <!-- Create the tabs -->
    <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
      <li><a href="javascript:void(0);" data-toggle="tab"><i class="fa fa-gears"></i></a></li>
    </ul>
    <!-- Tab panes -->
    <div class="tab-content">
      <!-- Home tab content -->
      <div class="tab-pane" id="control-sidebar-home-tab">
      </div>
      <!-- /.tab-pane -->
      <!-- Stats tab content -->
      <div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab Content</div>
      <!-- /.tab-pane -->
      <!-- Settings tab content -->
      <!-- /.tab-pane -->
    </div>
  </aside>
  <!-- /.control-sidebar -->
  <!-- Add the sidebar's background. This div must be placed
       immediately after the control sidebar -->
  <div class="control-sidebar-bg"></div>
</div>

<!-- ./wrapper -->
<!-- jQuery 2.2.3 -->
<script th:src="@{/plugins/jQuery/jquery-2.2.3.min.js}"></script>
<script type="text/javascript">
	function resizeWin(){
		var mainH = document.body.clientHeight;//网页可见区域高
		var hei= mainH - 142;
		//alert(hei);
		$("#sectCxid").css("height",hei+"px");
		$("#frameContentId").css("height",(hei - 30)+"px");
	}
	resizeWin();
	$(window).resize( function(){
	    resizeWin();
	});
</script>
<!-- Bootstrap 3.3.6 -->
<script th:src="@{/bootstrap/js/bootstrap.min.js}" type="text/javascript"></script>
<!-- Slimscroll -->
<script th:src="@{/plugins/slimScroll/jquery.slimscroll.min.js}" type="text/javascript"></script>
<!-- FastClick -->
<script th:src="@{/plugins/fastclick/fastclick.js}" type="text/javascript"></script>
<!-- AdminLTE App -->
<script th:src="@{/dist/js/app.min.js}"></script>

<!-- AdminLTE for demo purposes -->
<script th:src="@{/dist/js/demo.js}" type="text/javascript"></script>
 <script  th:inline="javascript" type="text/javascript">
 /*<![CDATA[*/
$(function(){
	var aRoot = /*[[${sysId}]]*/
	if(!aRoot){
		var cotextRoot = /*[[@{/}]]*/
		window.location.href =  cotextRoot;
	}
});
 //http://note.youdao.com/noteshare?id=a9d8283cf1e08ab3b32baee13c5c9834&sub=C027743F5EB54733A05CC2409F45357C
 function locationUrl(){
	 //alert(2);
	 window.open("http://note.youdao.com/share/?id=a9d8283cf1e08ab3b32baee13c5c9834&type=note#/");
 }
function loadFrame(aid,serverId,navInfo,link){
			$("[name='selectN']").removeClass();
			var cityElement=document.getElementById("item_"+aid).parentNode;
			cityElement.className= "active";
			$("#navId").nextAll().remove();
			var bs = navInfo.split(",");
			var blen = bs.length; 
			
			for(var i=blen -1;i>=0;i--){
				if(i == blen -1){
					$("#titleId").html(bs[i]);
					$("#navId").after("<li class='active'>"+bs[i]+"</li>"); 
				}else{
					$("#navId").after("<li><a href='#'>"+bs[i]+"</a></li>");
				}
			}
			var cotextRoot = /*[[@{/}]]*/
			if(null == serverId || 'null' == serverId){
				$("#frameContentId").attr("src",cotextRoot+link);	
			}else{
				$("#frameContentId").attr("src",serverId+'/'+link);
			}
}
/*]]>*/
</script>
</body>
</html>